<!-- subpkg_archive/form/index.vue -->
<script>
  export default { name: 'SubpkgArchiveFormIndexPage' }
</script>

<script setup>
  import { ref } from 'vue'
  import {
    patientAddApi,
    patientInfoApi,
    patientUpdateApi,
  } from '@/services/archive.js'

  const props = defineProps({
    id: String,
  })

  // 如果有id，要先获取详情
  if (props.id) {
    uni.setNavigationBarTitle({
      title: '编辑患者',
    })
    ;(async () => {
      const res = await patientInfoApi(props.id)
      console.log(res, 'res222222')
      const { age, genderValue, ...rest } = res.data
      form.value.data = rest
    })()
  }

  const formRef = ref(null)

  // 1. 获取表单数据
  const form = ref({
    data: {
      name: '',
      idCard: '',
      defaultFlag: 0,
      gender: 1, // 1-男, 0-女
    },
    // 2. 定义表单校验规则
    rules: {
      name: {
        rules: [
          { required: true, errorMessage: '请输入姓名' },
          { pattern: /^[\u4e00-\u9fa5]{2,5}$/, errorMessage: '姓名格式不正确' },
        ],
      },
      idCard: {
        rules: [
          { required: true, errorMessage: '请输入身份证' },
          {
            pattern:
              /^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/,
            errorMessage: '身份证格式不正确',
          },
        ],
      },
      gender: {
        rules: [
          {
            // 自定义校验逻辑：当依赖其他数据时，或无法使用内置校验规则和正则搞定时
            validateFunction(rule, curGender, formData, cb) {
              // 在这里面可以定义特殊的校验逻辑
              // 规则：身份证号中第17位用来标识性别，偶数为女，奇数为男
              // substr 第二个参数是个数
              // substring 第二个参数是结束索引（不包含）
              // 0 女  1 男，偶数 女   奇数  男
              if (formData.idCard.substr(16, 1) % 2 === curGender) {
                // 控制校验通过：return true
                return true
              }

              // 控制错误消息：cb(errorMessage)
              cb('性别和身份证不一致')
            },
          },
        ],
      },
    },
  })

  // const onChangeOfDefaultFlag = (e) => {
  //   form.value.data.defaultFlag = +e.detail.value
  // }

  // 3. 调用表单组件的校验方法
  const save = async () => {
    console.log('save')
    // await formRef.value.validate()

    /******** 实人认证 ********/
    // #ifdef APP
    // 1. 获取设备信息
    const metaInfo = uni.getFacialRecognitionMetaInfo()
    console.log('设备信息:', metaInfo)

    console.log(form.value, 'form.value')

    // 2. 调用云函数
    const res = await uniCloud.callFunction({
      name: 'certifyId',
      data: {
        metaInfo,
        realName: form.value.data.name,
        idCard: form.value.data.idCard,
      },
    })

    console.log(res, 'res')

    // 3. 客户端调起sdk刷脸认证
    await uni.startFacialRecognitionVerify({
      certifyId: res.result.certifyId,
    })

    // 认证成功，调用添加患者或者编辑患者的后端API接口

    // #endif
    /******** 实人认证 ********/

    // if (props.id) {
    //   // 编辑
    //   await patientUpdateApi(form.value.data)
    // } else {
    //   // 添加
    //   await patientAddApi(form.value.data)
    // }

    // // 提交成功，回到列表页
    // uni.navigateBack()
  }
</script>

<template>
  <scroll-page>
    <view class="archive-page">
      <!-- 条件1. uni-forms 要绑定 :model 和 :rules -->
      <uni-forms
        :model="form.data"
        :rules="form.rules"
        border
        label-width="220rpx"
        ref="formRef"
      >
        <!-- 条件2. 每个 uni-forms-item 需要绑定 name -->
        <uni-forms-item label="患者姓名" name="name">
          <!-- 条件3. 绑定 v-model 同步数据 -->
          <uni-easyinput
            v-model="form.data.name"
            placeholder-style="color: #C3C3C5; font-size: 32rpx"
            :styles="{ color: '#121826' }"
            :input-border="false"
            :clearable="false"
            placeholder="请填写真实姓名"
          />
        </uni-forms-item>
        <uni-forms-item label="患者身份证号" name="idCard">
          <uni-easyinput
            v-model="form.data.idCard"
            placeholder-style="color: #C3C3C5; font-size: 32rpx"
            :styles="{ color: '#121826' }"
            :input-border="false"
            :clearable="false"
            placeholder="请填写身份证号"
          />
        </uni-forms-item>
        <uni-forms-item label="患者性别" name="gender">
          <uni-data-checkbox
            v-model="form.data.gender"
            selectedColor="#16C2A3"
            :localdata="[
              { text: '男', value: 1 },
              { text: '女', value: 0 },
            ]"
          />
        </uni-forms-item>
        <uni-forms-item label="默认就诊人">
          <yyzx-switch
            v-model="form.data.defaultFlag"
            :trueValue="1"
            :falseValue="0"
            customStyle="transform: scale(0.7)"
          />

          <!-- 
          <view class="uni-switch">
            <switch
              :checked="form.data.defaultFlag === 1"
              @change="onChangeOfDefaultFlag"
              color="#20c6b2"
              style="transform: scale(0.7)"
            />
          </view>
           -->
        </uni-forms-item>
        <button class="uni-button" @click="save">保存</button>
      </uni-forms>
    </view>
  </scroll-page>
</template>

<style lang="scss">
  @import './index.scss';
</style>
